<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- <meta charset="GBK"> -->
    <!-- <meta charset="GB2312"> -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <form action=" " method="GET">
        <p>
            <label for="">用户名：</label><input name="user" type="text">
        </p>
        <p>
            <label for="">密&emsp;码：</label><input name="pwd" type="text">
        </p>
        <p>
            <label for="">手机号：</label><input name="phone" type="text">
        </p>
        <p>
            <label for="">邮&emsp;箱：</label><input name="email" type="text">
        </p>
        <p><input type="submit" value="提交" /></p>
    </form>
    <button id="get">获取</button>
    <!-- <button id="set">设置</button> -->
</body>
<script>
    var get = document.getElementById("get");
    var set = document.getElementById("set");
    get.onclick = function () {
        console.log(location.search);
        var str = location.search; //获取搜索栏的字符串

        var str1 = str.slice(1); //将字符串前面的?去掉
        var arr = str1.split("&"); //通过&分割字符串为数组
        console.log(arr);

        var data = {}; //建一个空对象
        arr.forEach(function (item) { //用forEach循环遍历数组
            var key = item.split("=")[0]; //通过=切割，将第一个值给key
            var val = item.split("=")[1]; //通过=切割，将第二个值给val
            data[key] = val; //通过[]去对象值
        });
        console.log(data);
    }

</script>

</html>